<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Card</title>
    <link rel="stylesheet" href="../dist/aqua.css" />
    <link rel="stylesheet" href="./styles/demo.css" />
    <link rel="stylesheet" href="./styles/card.css" />
</head>

<body>
    <div class="card p-9 shadow-xl">
        <ul class="progress-list">
            <li class="progress-list__item">
                <div class="weekday-abbr">
                    MO
                </div>
                <progress class="progress-bar" max="145" value="109"></progress>
            </li>
            <li class="progress-list__item">
                <div class="weekday-abbr">
                    TU
                </div>
                <progress class="progress-bar" max="145" value="74"></progress>
            </li>
            <li class="progress-list__item">
                <div class="weekday-abbr">
                    WE
                </div>
                <progress class="progress-bar" max="145" value="55"></progress>
            </li>
            <li class="progress-list__item">
                <div class="weekday-abbr">
                    TH
                </div>
                <progress class="progress-bar" max="145" value="118"></progress>
            </li>
            <li class="progress-list__item">
                <div class="weekday-abbr">
                    FR
                </div>
                <progress class="progress-bar" max="145" value="90"></progress>
            </li>
            <li class="progress-list__item">
                <div class="weekday-abbr">
                    SA
                </div>
                <progress class="progress-bar" max="145" value="116"></progress>
            </li>
            <li class="progress-list__item">
                <div class="weekday-abbr">
                    SU
                </div>
                <progress class="progress-bar" max="145" value="72"></progress>
            </li>
        </ul>
    </div>
</body>

</html>